<% if Merb.env != "test" %>
<style type="text/css" media="screen">
  body {
    font-family:arial;
    font-size:11px;
  }
  p.options {
    text-align: right;
  }
    p.options label {
      margin-left: 10px;
    }
    p.options span.all {
      padding: 5px;
      border: 1px solid #000;
      background-color: #fff;
    }
    p.options input {
      position: relative;
    }
  h1 {
    font-size:48px;
    letter-spacing:-4px;
    margin:0 0 20px 0;
    line-height:36px;
    color:#333;
  }
    h1 sup {
      font-size: 0.5em;
    }
    h1 sup.error_500, h1 sup.error_400 {
      color:#990E05;
    }
    h1 sup.error_100, h1 sup.error_200 {
      color:#00BF10;
    }
    h1 sup.error_300 {
      /* pretty sure you cant 'see' status 300 
      errors but if you could I think they 
      would be blue */
      color:#1B2099;
    }
  h2 {
    font-size:24px;
    letter-spacing:-1px;
    margin:0;
    line-height:28px;
    color:#444;
  }
  h3 {
    cursor: pointer;
    color: #006;
    text-decoration: underline;
  }
  a, a:visited {
    color:#00BF10;
  }
  .internalError {
    width:800px;
    margin:50px auto;
  }
  .header {
    border-bottom:10px solid #333;
    margin-bottom:1px;
    background-image: url("");
    padding:20px;
  }
    .header ul {
      padding: 5px;
      background-color: white;
    }
      .header ul li {
        list-style-type: none;
        font-size: 16px;
        margin-bottom: 6px;
      }
  
  table.listing {
    border-collapse: collapse;
    font-size: 12px;
    width: 100%;
  }
  
  table.listing th {
    background-color: #000;
    color: #fff;
  }
  
  table.listing td, table.listing th {
    padding: 5px;
    text-align: left;
    vertical-align: top;
  }
  
  table.listing tr.odd {
    background-color: #ccc;
  }
  
  table.listing tr.even {
    background-color: #aaa;
  }
  
  table.listing td[colspan=2] {
    text-align: center;
  }
  
  table.trace {
    width:100%;
    font-family:courier, monospace;
    letter-spacing:-1px;
    border-collapse: collapse;
    border-spacing:0;
  }
  table.trace tr td{
    padding:0;
    height:26px;
    font-size:13px;
    vertical-align:middle;
  }
  table.trace tr.file{
    border-top:2px solid #fff;
    background-color:#F3F3F3;
  }
  table.trace tr.source {
    background-color:#F8F8F8;
    display:none;
  }
  table.trace .open tr.source {
    display:table-row;
  }
    table.trace tr.file td.expand {
      width:23px;
      background-image: url();
      background-position:top left;
      background-repeat:no-repeat;
    }
    table.trace tr.file td.expand div {
      width:23px;
    }
    table.trace .open tr.file td.expand {
      width:23px;
      background-image: url();
      background-position:top left;
      background-repeat:no-repeat;        
    }
    table.trace .open tr.file td.expand div {
      width:23px;
    }
    table.trace tr.source td.collapse {
      width:23px;
      background-image: url();
      background-position:bottom left;
      background-repeat:no-repeat;  
      background-color:#6F706F;     
    }
    table.trace tr td.path {
      padding-left:10px;
    }
    table.trace tbody.app td.path {
      color: #900;
    }
    table.trace tbody.framework td.path {
      color: #009;
    }
    table.trace tbody.gem td.path {
      color: #090;
    }
    table.trace tr td.code {
      padding: 10px 0 10px 20px;
      white-space: pre;
    }
      table.trace tr td.code div {
        width: 700px;
        overflow-x: auto;
        overflow-y: hidden;
      }
      table.trace tr td.code em {
        font-weight:bold;
        color:#00BF10;
      }
      table.trace tr td.code a {
        width: 20px;
        float: left;
      }
      table.trace tr td.code .more {
        color:#666;
      }
    table.trace tr td.line {
      width:30px;
      text-align:right;
      padding-right:4px;
    }
  .footer {
    margin-top:5px;
    font-size:11px;
    color:#444;
    text-align:right;
  }
</style>
<% end %>